<template>
  <div>
    <el-form
      class="input-form"
      label-position="right"
      label-width="120px"
      ref="editForm"
      :rules="propRules"
      :disabled="propReadonly"
      :model="form"
    >
      <el-row :gutter="20">
        <el-col :span="12">
          <el-form-item label="标签代码" prop="code">
            <el-input v-model="form.code" />
          </el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item label="标签名称" prop="name">
            <el-input v-model="form.name" />
          </el-form-item>
        </el-col>
      </el-row>
      <el-row :gutter="20">
        <el-col :span="12">
          <el-form-item label="版本" prop="version">
            <el-input v-model="form.version" />
          </el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item label="类型" prop="type">
            <!--<el-input v-model="form.type" />-->
            <el-select v-model="form.type" placeholder="请选择">
              <el-option key="MASO" value="MASO" label="码尚"></el-option>
              <el-option key="Excel" value="Excel" label="MS Excel" :disabled="true"></el-option>
            </el-select>
          </el-form-item>
        </el-col>
      </el-row>
      <el-row :gutter="20">
        <el-col :span="24">
          <el-form-item label="备注" prop="remark">
            <el-input v-model="form.remark" />
          </el-form-item>
        </el-col>
      </el-row>
    </el-form>
  </div>
</template>

<script>
/* eslint-disable */
export default {
  data() {
    return {
      form: {},
      viewData: {}
    }
  },
  created() {
    this.$emit('event-register', {
      validate: callback => {
        this.$refs.editForm.validate(callback)
      },
      beforeSave: () => {
        this.$emit('data-callback', this.form)
        return true
      },
      afterMove: (formData, initData, status) => {
        this.form = global.utils.jsonClone(formData)

        if (status == 'addnew') {
          this.$set(this.form, 'type', 'Excel')
        }
        // 设置switch 元素默认值
      },
      afterSave: () => {},
      beforeDelete: () => {
        return true
      },
      afterClick: (button, data) => {
        if (button.key == 'design_label') {
          const params = {
            code: this.form.code,
            version: this.form.version
          }
          this.$ajax.post('/sys/label/getLabelContent', params).then(res => {
            if (res.success) {
              // -- invoke shell --
              let para = {
                action: 'designLabel',
                labelCode: res.data.code,
                labelVersion: res.data.version,
                labelContent: res.data.content,
                labelName: res.data.name,
                labelType: res.data.type
              }
              if(!chrome || !chrome.webview) {
                global.utilMessage.alertFail('当前操作需要客户端支持，请在码尚客户端中使用。')
                return
              }
              return chrome.webview.postMessage(para)
              // if (window.commonJsInvokeShell) {
              //   let returnString = commonJsInvokeShell(para)
              //   //this.utilMessage(returnString)

              //   let jsonReturn = JSON.parse(returnString)
              // } else {
              //   global.utilMessage.alertFail('当前操作请在外壳客户端中使用')
              // }
            }
          })
        } else {
          this.utilMessage('unknown button ' + button.key)
        }
      },
      beforeFlow: flowButtonKey => {
        return true
      },
      afterFlow: flowButtonKey => {},
      beforeClose: () => {
        return true
      }
    })
  },
  props: {
    propParent: Object,
    propInitData: Object,
    propPrimaryKey: String,
    propDictionaries: Object,
    propCurrentRow: Object,
    propViewFormData: Object,
    propReadonly: Boolean,
    propStatus: String,
    propRules: Object
  },
  components: {},
  mounted() {
    window.commonShellInvokeJs = this.commonShellInvokeJs
  },
  methods: {
    commonShellInvokeJs(paraShell) {
        let action = paraShell.action
        this.utilMessage('HTML收到外壳调用请求，action = ' + action)
        if (action == 'downloadLabelContent') {
          this.$ajax
            .post('/sys/label/getLabelContent', {
              code: paraShell.labelCode,
              version: paraShell.labelVersion
            })
            .then(res => {
              if (res.success) {
                let para = {
                  action: 'downloadLabelContent_callback',
                  labelCode: res.data.code,
                  labelVersion: res.data.version,
                  labelMVersion: res.data.mversion,
                  labelContent: res.data.content,
                  labelName: res.data.name,
                  labelType: res.data.type,
                  taskId: paraShell.taskId
                }
                let returnString = commonJsInvokeShell(para)
              }
            })
        } else if (action == 'saveLabelContent') {
          const params = {
            code: paraShell.labelCode,
            version: paraShell.labelVersion,
            content: paraShell.labelContent
          }
          this.$ajax.post('/sys/label/saveLabelContent', params)
            .then(res => {
              if (res.success) {
                this.utilMessage.success(res.msg)
              } else {
                this.utilMessage(res.error)
              }
            })
          return {
            success: 'true',
            message: '标签内容正在异步上传服务端保存，将在页面中提示保存结果'
          }
        } else if (action == 'reportPrinter') {
          this.$ajax
            .post('/sys/printer/reportPrinter', {
              warehouseId: this.utils.getCurrentWarehouse().id,
              url: paraShell.url,
              name: paraShell.printerName
            })
            .then(res => {
              if (res.success) {
                this.utilMessage.success(res.data.result)
              }
            })
        } else {
          return {
            success: false,
            message: `HTML收到外壳调用指令，action = ${action}, 该指令尚未实现，请在HTML中实现`
          }
        }
        return {
          success: true,
          message: 'HTML收到外壳调用指令，action = ' + action + ', 正在处理中...'
        }
      }
  }
}
</script>

<style lang="scss" scoped>
.container {
  width: 100%;
  height: 100%;
}
</style>
